<ui:component xmlns="http://www.w3.org/1999/xhtml"  
     xmlns:f="http://java.sun.com/jsf/core"
     xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.prime.com.tr/ui"> 
    
<center>

 <h:form id="form">  

<p:panel header="Cadastro de Atividade" >

	  <h:panelGrid columns="2" cellpadding="2" >
	
	   		<h:outputText for="titulo" value="Título"/>  
	   		<p:inputText 
                     	id="titulo" 
                     	required="true" 
                     	label="Título" 
                     	size="40" 
                        value="#{atividadeBean.atividade.titulo}" /> 
                        
            <h:outputText for="descricao" value="Descrição"/>
            
            <p:inputTextarea style="width:500px;height:100px;" effectDuration="400"
                     	id="descricao" 
                     	required="true" 
                     	label="Descrição" 
                        value="#{atividadeBean.atividade.descricao}" /> 
             
            <h:outputText for="local" value="Local "/>  
            <p:inputText 
                     	id="local" 
                     	required="true" 
                     	label="Local" 
                     	size="40" 
                        value="#{atividadeBean.atividade.local}" /> 
			  
			            
            <h:outputText for="dataAtividade" value="Data/Horário "/>  
			 <p:calendar id="dataAtividade" 
           				value="#{atividadeBean.atividade.dataAtividade}" 
           				mode="popup"
           				locale="pt_BR"
           				label="Data/Horário"
           				autocomplete="true"
           				size="16"
           				effect="drop"
           				pattern="dd/MM/yyyy HH:mm" 
           				navigator="true"
           				required="true"
           				/>                     
           				 
			 <p:commandButton value="Gravar" image="ui-icon ui-icon-disk"
                             actionListener="#{atividadeBean.cadastrarAtividade}" update="atividades"/>  
			
			<p:commandButton value="Limpar" image="ui-icon ui-icon-cancel" type="reset"/>  
	
       </h:panelGrid>
	 
    </p:panel>

<p:separator/>
<p:growl id="messages"/>  
<p:separator/>

<p:dataTable 
 		id="atividades" 
 		value="#{atividadeBean.atividadesCadastradas}" 
  		var="atividade" 
 		emptyMessage="Não há atividades cadastradas" 
 		paginator="true" 
 		rows="10"
 		dynamic ="true" 
        > 
         
  		<f:facet name="header">  
                <h:outputText value="Lista de Atividades"/>  
        </f:facet>
            
         <p:column headerText="Título">  
         
               		<center>
                    	<h:outputText value="#{atividade.titulo}" style="width:8%"/>  
                	</center>
               
  	 	</p:column>  
   
        <p:column headerText="Descrição">  
          
               		<center>
                    	<h:outputText value="#{atividade.descricao}" style="width:150px"/>  
                	</center>
                
  	 	</p:column>
        
     	 <p:column headerText="Local">  
          
               		<center>
                    	<h:outputText value="#{atividade.local}" style="width:150px"/>  
                	</center>
                
  	 	</p:column>
  	 	
 		<p:column headerText="Criada em" style="width:12%">  
        
               		<center>
               		<h:outputText value="#{atividade.dataCadastro}" > 
            			<f:convertDateTime  pattern="dd/MM/yyyy"/>
            		</h:outputText>
                   	</center>
                
   		</p:column> 
   		
   		<p:column headerText="Data/Horário" style="width:12%">  
        
               		<center>
               		<h:outputText value="#{atividade.dataAtividade}" > 
            			<f:convertDateTime timeZone="GMT-3" pattern="dd/MM/yyyy HH:mm"/>
            		</h:outputText>
                   	</center>
                
   		</p:column> 
   		
  </p:dataTable> 

</h:form>
</center> 
 
</ui:component>